<template>
  <div>

    <mt-navbar v-model="selected" style="margin-bottom: 15px;">
      <mt-tab-item id="0">个人</mt-tab-item>
      <!--<mt-tab-item id="1">企业</mt-tab-item>-->
      <!--<mt-tab-item id="2">非企业性单位</mt-tab-item>-->
    </mt-navbar>

    <!-- tab-container -->
    <mt-tab-container v-model="selected" :swipeable="true">
      <mt-tab-container-item id="0">
        <mt-field class="borderBottm mustFlag paddingLeft" label="发票抬头" placeholder="请输入发票抬头" v-model="personBillTitle"></mt-field>
        <mt-field class="paddingLeft" label="备注信息" placeholder="请输入备注信息" type="email" v-model="personRemarks"></mt-field>
        <mt-button type="primary" size="large" :disabled="disableFlag" style="width: 95%;margin: 20px auto;" @click="billHandle(0)">确定</mt-button>

      </mt-tab-container-item>
      <mt-tab-container-item id="1">

        <mt-field class="borderBottm mustFlag paddingLeft" label="发票抬头" placeholder="请输入发票抬头" v-model="companyBillTitle"></mt-field>
        <mt-field class="borderBottm mustFlag paddingLeft" label="纳税人识别号" placeholder="请输入纳税人识别号" v-model="companyNum"></mt-field>
        <mt-field class="borderBottm  paddingLeft" label="注册地址" placeholder="请输入注册地址" v-model="companyAdd"></mt-field>
        <mt-field class="borderBottm  paddingLeft" label="注册电话" placeholder="请输入注册电话" v-model="companyPhone"></mt-field>

        <mt-field class="borderBottm  paddingLeft" label="开户行" placeholder="请输入开户行" v-model="companyBankAdd"></mt-field>
        <mt-field class="borderBottm  paddingLeft" label="开户账号" placeholder="请输入开户账号" v-model="companyBankNum"></mt-field>

        <mt-field class="paddingLeft" label="备注信息" placeholder="请输入备注信息" type="email" v-model="companynRemarks"></mt-field>
        <mt-button type="primary" size="large" :disabled="disableFlag" style="width: 95%;margin: 20px auto;" @click="billHandle(1)">确定</mt-button>

      </mt-tab-container-item>
      <mt-tab-container-item id="2">
        <mt-field class="borderBottm mustFlag paddingLeft" label="发票抬头" placeholder="请输入发票抬头" v-model="ngoBillTitle"></mt-field>
        <mt-field class="paddingLeft" label="备注信息" placeholder="请输入备注信息" type="email" v-model="ngoRemarks"></mt-field>
        <mt-button type="primary" size="large" :disabled="disableFlag" style="width: 95%;margin: 20px auto;" @click="billHandle(2)">确定</mt-button>

      </mt-tab-container-item>
    </mt-tab-container>

  </div>
</template>

<script>

import { applyInvoice } from '@/api/bill/bill'

export default {
  name: 'bill',
  data() {
    return {
      disableFlag: false,
      selected: '0',
      personBillTitle: '',
      personRemarks: '',
      ngoBillTitle: '',
      ngoRemarks: '',
      companyBillTitle: '',
      companyNum: '',
      companyAdd: '',
      companyPhone: '',
      companyBankNum: '',
      companyBankAdd: '',
      companynRemarks: ''
    }
  },
  mounted(){
    console.log( this.$route.query.rltOrderIds)
  },
  methods: {
    billHandle: function (tabId) {
      console.log(tabId)
      console.log(this.$route.query.custId)
      // 个人
      if(tabId == 0){
        if(!this.personBillTitle){
          this.$toast({
            message: '发票抬头必填',
          })
          return
        }
        let jsondata = {
          invoiceType: tabId,
          custId: this.$route.query.custId,
          name: this.personBillTitle,
          remark:this.personRemarks,
          carNumber: this.$route.query.carNumber,
          isDefault: 0,
          rltOrderIds:JSON.parse(this.$route.query.rltOrderIds)
        }
        console.log(jsondata)
        applyInvoice(jsondata).then(result => {
          console.log(result)
          if(result.code == 0){
            this.$router.push({
              path: 'billMsg',

            })
          }
        })
      }



      // 企业
      if(tabId == 1){
        if(!this.companyBillTitle){
          this.$toast({
            message: '发票抬头必填',
          })
          return
        }

        if(!this.companyNum){
          this.$toast({
            message: '纳税人识别号必填',
          })
          return
        }

        let jsondata = {
          invoiceType: tabId,
          custId: this.$route.query.custId,
          name: this.companyBillTitle,
          taxid: this.companyNum,
          bankName:this.companyBankAdd,
          phone:this.companyPhone,
          cardNo:this.companyBankNum,
          address:this.companyAdd,
          remark:this.companynRemarks,
          carNumber: this.$route.query.carNumber,
          isDefault:0,
          rltOrderIds:JSON.parse(this.$route.query.rltOrderIds)
        }
        console.log(jsondata)
        applyInvoice(jsondata).then(result => {
          if(result.code == 0){
            this.$router.push({
              path: 'billMsg',
            })
          }
        })
      }





    }
  }
}
</script>

<style scoped lang="scss">
  .borderBottm {
    border-bottom: 1px solid #e0e0e0;
  }
  .paddingLeft{
    padding-left: 15px;
  }
  .mustFlag {

    position: relative;
  }

  .mustFlag:before {
    content: '*';
    position: absolute;
    top:15px;
    font-size: 20px;
    color: #f00;
  }

  > > > .mint-tab-item-label{
    font-size: 14px;
  }


</style>
